<!DOCTYPE html>
<html>
  <head>
    <title>Eval speed tests</title>
    <script>

function test(func, args) {
	var t0 = (new Date()).getTime();
	for (var i = 0; i < 100; i++)
		func.apply(null, args);
	return (new Date()).getTime() - t0;
}
    
    </script>
  </head>
<body>
  <h1>Eval Is Slow</h1>
  <p><em>Adapted from <a href="http://dhtmlkitchen.com/learn/js/perf/eval/eval.html">http://dhtmlkitchen.com/learn/js/perf/eval/eval.html</a>.</em></p>
  <p>
	This test iterates through every element in this page. The function that 
	uses eval takes a duration that is two to five times as long as 
	the function that does not use eval. Although eval 
	is always slower, the amount by which it is slower varies greatly between browsers 
	(like all things).
  </p>
<table border="1">
	<tr>
		<td>
			<input type="button" value="run findElementEval('script')" 
				onclick="document.getElementById('eval').value = test(findElementEval, ['script'])" />
		</td>
		<td>
			<input type="text" id="eval" size="30" />
		</td>
	</tr>
	<tr>
		<td>
			<input type="button" value="run findElement('script')" 
				onclick="document.getElementById('noEval').value = test(findElement, ['script'])" />
		</td>
		<td>
			<input type="text" id="noEval" size="30" />
		</td>
	</tr>
	<tr>
		<td>
			<input type="button" value="run findElementReeval('script')" 
				onclick="document.getElementById('reEval').value = test(findElementReeval, ['script'])" />
		</td>
		<td>
			<input type="text" id="reEval" size="30" />
		</td>
	</tr>
</table>

	<script type="text/javascript" style="display: block; white-space: pre">

function findElementReeval(tagName) {
	return eval('(' + findElement + ')')(tagName);
}
	
function findElementEval(tagName) {
	var coll = document.all ? document.all : document.getElementsByTagName("*");
	var tag;
	for(var i = 0, len = coll.length; i < len; i++) {
		tag = eval("coll["+i+"]");
	}
}
	
function findElement(tagName) {
	var coll = document.all ? document.all : document.getElementsByTagName("*");
	var tag;
	for(var i = 0, len = coll.length; i < len; i++) {
		tag = coll[i];
	}
}

</script>
</body>
</html>
